<template>
	<div id="fenlei">
		<feilei-head v-if="flag"></feilei-head>
		<div class="banner" v-if="flag"></div>
		<fenleiNav :fenleiList="List" v-if="flag"></fenleiNav>
		<router-view></router-view>
	</div>
</template>

<script>
	import fenleiNav from '../../view/nav/fenleiNav.vue'
	import feileiHead from '../../view/head/fenlei-head.vue'
	export default{
		name:'fenlei',
		data(){
			return{
				flag:true,
				List:[
					{
						id:'1',
						text:'上新馆',
						path: 'shangxin',
					},
					{
						id:'2',
						text:'出版馆',
						path: 'chuban',
					},
					{
						id:'3',
						text:'美妆馆',
						path: 'meizhuang',
					},
					{
						id:'4',
						text:'文房馆',
						path: 'wenhua',
					},
					{
						id:'5',
						text:'香氛馆',
						path: 'xiangfen',
					},
					{
						id:'6',
						text:'首饰馆',
						path: 'shoushi',
					},
					{
						id:'7',
						text:'铜器馆',
						path: 'tongqi',
					},
					{
						id:'8',
						text:'陶瓷馆',
						path: 'taochi',
					},
					{
						id:'9',
						text:'丝绸馆',
						path: 'shichou',
					},
					{
						id:'10',
						text:'家居馆',
						path: 'jiaju',
					},
				]
			}
		},
		components:{
			fenleiNav:fenleiNav,
			feileiHead:feileiHead

		},
		mounted(){
			if(this.$route.path=="/fenlei/shangxin"){
				this.flag=false
			}
			console.log(this.$route.path)
		}
	}
</script>

<style scoped="scoped">
	#fenlei .head{
		height: 0.88rem;
		background: #C30D23;
		position: relative;
	}
	
	#fenlei .head .searchBox{
		width: 3.15rem;
		height: 0.32rem;
		background:rgb(205,52,70);
		border-radius: 0.06rem;
		position: absolute;
		top: 0.48rem;
		left: 0.3rem;
		display: flex;
	}
	
	#fenlei .head .searchBox .searchBtn{
		width: 0.28rem;
		height: 0.28rem;
		background-image: url(../../assets/img/searchBar.png);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center center;
		margin: 0.02rem 0 0 0.11rem;
	}
	#fenlei .head .searchBox .search{
		font-size: 0.14rem;
		background:rgb(205,52,70);
		color: #FFFFFF;
		border: none;
		margin: 0.05rem 0 0 0.14rem;
		opacity: 0.5;
	}
	
	#fenlei .banner{
		background-image: url(../../assets/img/fenlei-banner.png);
		width: 2.69rem;
		height: 1rem;
		position: absolute;
		top: 1rem;
		left: 0.92rem;
	}
</style>
